/* 新增的CSS样式 */
/* ... 其他样式 ... */

.pagination {
    display: flex;
    justify-content: center; /* 水平居中 */
    gap: 10px; /* 分页链接之间的间隙 */
    margin-top: 20px; /* 与表格的间隙 */
}

.pagination a {
    padding: 8px 16px; /* 链接内边距 */
    border: 1px solid #b3e0e9; /* 边框颜色 */
    border-radius: 5px; /* 边框圆角 */
    text-decoration: none; /* 去除下划线 */
    color: #42a5f5; /* 文字颜色 */
    background-color: #e0f7fa; /* 背景颜色 */
    transition: background-color 0.3s; /* 背景色变化过渡效果 */
}

.pagination a:hover {
    background-color: #b3e0e9; /* 鼠标悬停时的背景颜色 */
}

.pagination .current {
    padding: 8px 16px; /* 当前页码的内边距 */
    border: 1px solid #b3e0e9; /* 边框颜色 */
    border-radius: 5px; /* 边框圆角 */
    background-color: #b3e0e9; /* 当前页码的背景颜色 */
    color: white; /* 当前页码的文字颜色 */
}

.pagination button {
    padding: 8px 16px; /* 链接内边距 */
    border: 1px solid #b3e0e9; /* 边框颜色 */
    border-radius: 5px; /* 边框圆角 */
    text-decoration: none; /* 去除下划线 */
    color: #42a5f5; /* 文字颜色 */
    background-color: #e0f7fa; /* 背景颜色 */
    transition: background-color 0.3s; /* 背景色变化过渡效果 */
}

.pagination button:hover {
    background-color: #b3e0e9; /* 鼠标悬停时的背景颜色 */
}